<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<%@page import="durak.utils.*, durak.utils.Constants"%>
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen"/>
<link rel="stylesheet" href="css/UI.css" type="text/css" media="screen"/>
<script src="js/jquery-1.8.2.js"></script>
<script src="js/jquery-ui-1.9.0.custom.js"></script>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Online Durak</title>
<!--        Link the Bootstrap (from twitter) CSS framework in order to use its classes-->

</head>
<body>
	<div id="container">
		<% String usernameFromSession = SessionUtils.getUsername(request);%>
		<% String usernameFromParameter = request.getParameter(Constants.USERNAME) != null ? request.getParameter(Constants.USERNAME) : "";%>
		<% if (usernameFromSession == null) {%>
		<div class="welcome1"><h1>Welcome to the Online </h1></div>
		<br></br>
		<div class=welcome2><h2>Please enter a unique user name:</h2></div>
		<form method="GET" action="login" class="welcome3">
			<input type="text" class="text ui-widget-content ui-corner-all" name="<%=Constants.USERNAME%>"
				value="<%=usernameFromParameter%>"></input> <input type="submit" value="Login" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only ui-state-hover" role="button" aria-disabled="false"></input>

		</form>
		<% Object errorMessage = request.getAttribute(Constants.USER_NAME_ERROR);%>
		<% if (errorMessage != null) {%>
		<span class="label important"><%=errorMessage%></span>
		<% } %>
		<% } else {%>
		<div class=welcome-back>
			<h1>
				Welcome back,
				<%=usernameFromSession%></h1>
			<input type=button onclick="location.href='gamesRoom.jsp'"
				value="Click here to start playing!"
				class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only ui-state-hover"
				role="button" aria-disabled="false" /> <br /> <input type=button
				onclick="location.href='login?logout=true'" id="logout" value="              Logout             "
				class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only ui-state-hover"
				role="button" aria-disabled="false" />
		</div>
		<% }%>
	</div>
</body>
</html>